.SongSheetComBox{
    .boutiqueSong{
        width: 100%;
        height: 180px;
        border-radius: 5px;
        background-image: linear-gradient(90deg, #3F2A44, #6D6174);
        display: flex;
        color:#fff;
        align-items: center;
        cursor: pointer;
        .one{
            width: 14%;
            height: 100%;
            padding:10px 15px;
            display: flex;
            align-items: center;
            img{
                width: 100%;
                height: 160px;
            }
        }
        .two{
            div:nth-child(1){
                border:1px solid #E7AA5A;
                border-radius: 15px;
                width: 100px;
                text-align: center;
                padding:3px;
                color:#E7AA5A;
                span{
                    vertical-align: middle;
                    font-size: 14px;
                }
                i{
                    vertical-align: middle;
                    margin-right:3px;
                }
            }
            div:nth-child(3){
                font-size: 12px;
                margin-top:10px;
                color:#999;
            }
        }
    }
    .boutiqueSongMain{
        .title{
            display: flex;
            justify-content: space-between;
            margin-top:20px;
            .all{
                font-size: 14px;
                border:1px solid #ccc;
                padding: 5px 15px;
                border-radius: 15px;
                color:#666;
                cursor: pointer;
                i{
                    font-size: 12px;
                    color:#666;
                    vertical-align: middle;
                    margin-left:3px;
                }
                span{
                    vertical-align: middle;
                }
            }
            .type{
                display: flex;
                justify-content: space-between;
                align-items: center;
                width: 45%;
                font-size: 12px;
                cursor: pointer;
                color:#666;
                span{
                    height: 20px;
                    line-height: 20px;
                    padding:0 8px;
                    border:1px solid transparent;
                }
                .spanActive{
                    border-radius:10px;
                    background-color: #FDF5F5;
                    color:#F59B9B;
                }
            }
        }
        .songList{
            ul{
                display: flex;
                flex-wrap: wrap;
                justify-content: space-between;
                li{
                    position: relative;
                    width: 18%;
                    height: 250px;
                    border-radius: 5px;
                    margin-top:10px;
                    cursor: pointer;
                    img{
                        width: 100%;
                        height: 200px;
                        border-radius: 5px;
                    }
                    .text{
                        font-size: 14px;
                        color:#666;
                    }
                    .playCount{
                        position: absolute;
                        font-size: 12px;
                        top:5px;
                        right:10px;
                        i{
                            color:#fff;
                            font-size: 12px;
                        }
                        span{
                            color:#fff;
                        }
                    }
                    .bfBth{
                        display: none;
                        position: absolute;
                        width: 30px;
                        height: 30px;
                        bottom:60px;
                        right:5px;
                        color:red;
                        border-radius: 50%;
                        background-color: #fff;
                        transition: all 0.5;
                        i{
                            position: relative;
                            top:4px;
                            left:8px;
                        }
                    }
                    .bfBthAvtive{
                        position: absolute;
                        width: 30px;
                        height: 30px;
                        bottom:55px;
                        right:5px;
                        color:red;
                        border-radius: 50%;
                        background-color: #fff;
                        transition: all 0.5;
                        i{
                            position: relative;
                            top:4px;
                            left:8px;
                        }
                    }
                    .nickname{
                        position: absolute;
                        bottom:60px;
                        left:5px;
                        font-size: 12px;
                        i{
                            color:#fff;
                            font-size: 12px;
                            margin-right:3px;
                            vertical-align: middle;
                        }
                        span{
                            color:#fff;
                            vertical-align: middle;
                        }
                    }
                }
            }
        }
        .pagination{
            margin:10 auto;
            width: 100%;
            height: 200px;
            display: flex;
            padding-top:20px;
            justify-content: center;
        }
    }
}